import { defineAsyncComponent } from 'vue'

/**
 * 组件里面注册控件用
 * * 文本
 * ** emap-form-text 单行文本、电话、邮件、搜索
 * ** emap-form-area 多行文本
 * ** emap-form-password 密码
 * ** emap-form-url
 * * 数字
 * ** emap-form-number 数字
 * ** emap-form-range 滑块
 * * 日期
 * ** emap-form-date 日期、年月、年周、年
 * ** emap-form-time 时间
 * * 选择
 * ** emap-form-checkbox 勾选
 * ** emap-form-switch 开关
 * ** emap-form-checkboxs 多选组
 * ** emap-form-radios 单选组
 * ** emap-form-select 下拉选择
 */
export const formItemList = {
  // 文本类 defineComponent
  'emap-form-text': defineAsyncComponent(() => import('./emap-form-text.vue')),
  // 数字
  'emap-form-number': defineAsyncComponent(() => import('./emap-form-number.vue')),
  // 日期、时间
  'emap-form-date': defineAsyncComponent(() => import('./emap-date.vue')),
  // 开关
  'emap-form-switcher': defineAsyncComponent(() => import('./emap-form-switcher.vue')),
  // 选择类
  'emap-form-radiolist': defineAsyncComponent(() => import('./emap-form-radiolist.vue')),
  // 下拉单选
  'emap-form-select': defineAsyncComponent(() => import('./emap-form-select.vue')),
}

/**
 * 动态组件的字典，便于v-for循环里面设置控件
 */
export const formItemListKey = {
  // 文本类
  text: formItemList['emap-form-text'], 
  // 数字
  number: formItemList['emap-form-number'], // 数字
  // 日期、时间
  date: formItemList['emap-form-date'],
  // 开关
  switcher: formItemList['emap-form-switcher'], //开关
  // 选择
  radiolist: formItemList['emap-form-radiolist'], //单选组
  // 下拉单选
  select: formItemList['emap-form-select'],
  // 下拉多选
  // 日期范围
}


export function formItemComponents () {
  const com = {
    'emap-form-text': defineAsyncComponent(() => import('./t-text.vue')),
    // 数字./emap-form-number.vue
    'emap-form-number': defineAsyncComponent(() => import('./n-number.vue')),
    // 日期./emap-date.vue
    'emap-form-date': defineAsyncComponent(() => import('./d-date.vue')),
    // 开关
    'emap-form-switcher': defineAsyncComponent(() => import('./emap-form-switcher.vue')),
  }
  return com
}
